<template>
	<scroll-view scroll-y class="" style="background: #AEE2DA;"
		:style="{background:'url('+Imgbase+'/1zhan_new_sbgc2.jpg)','background-size':'100%',}">
		<cu-custom bgColor="bg-newblue" :isBack="true">
			<block slot="content">{{title}}</block>
		</cu-custom>
		<view v-if="desc" style="position: relative;width: 100%;margin-top: 10upx;min-height: 1300upx;z-index: 999;">
			<view class="" style="width: 98%;height: 200rpx; margin: 20rpx auto 0;padding-left: 15rpx;"
				:style="{background:'url('+Imgbase+'/app_newpoordetail_rulekuang.png)','background-size':'100%',}">
				<!-- <scroll-view scroll-x class=" nav" style="width: 92%;margin-left: 4%;box-shadow:3px 3px 3px 0px #e5c757;border-radius: 15upx;"> -->
				<view class="  text-ablack" style="text-align: center;padding-top: 40rpx;">
					每一抽都有概率获得以下物品
				<!-- 	<text>
						个人连续{{num}}抽，
					</text>
					<span v-if="open_custom_box == 0">
						不出SSS、SSR、SR赏级的赏品<br>
					</span>
					<span v-if="open_custom_box == 1">
						不出{{open_custom_box_mes}}赏级的赏品<br>
					</span>
					<text>
						则进行一次MBOX赏抽取
					</text> -->
				</view>
				<!-- </scroll-view> -->
			</view>
			<view style="clear: both;"></view>

			<view class="" style="padding-top: 0rpx;z-index: 999;width: 96%;margin: 0 auto;"
				:style="{background:'url('+Imgbase+'/new1_infinite_boxkuangbgc.png) no-repeat','background-size':'100% 100%'}">

				<!-- MBOX赏 -->
				<view class=""
					style="position: relative;background: #FBFADC;  min-height: 1000rpx;width: 96%; margin: 0 auto;padding-top: 20rpx;">
					<view class="cu-card article light" style="position: relative;
				width: 100%;margin-left: 0%;margin-top: 10upx;" v-for="(item,index) in desc.extroinfo">
						<view class="padding-left padding-tb-xs" style="height: 55upx;">
							<view class="fl">
								<image :src="Imgbase + '/new1_infinite_SSR.png'" style="width: 118upx;height: 45upx;"
									mode="widthFix" v-if="item.reword_type_id == 31"></image>
								<image :src="Imgbase + '/new1_infinite_SR.png'" style="width: 90upx;height: 45upx;"
									mode="widthFix" v-if="item.reword_type_id == 32"></image>
								<image :src="Imgbase + '/new1_infinite_SD.png'" style="width: 90upx;height: 45upx;"
									mode="widthFix" v-if="item.reword_type_id == 30"></image>
								<image :src="Imgbase + '/new1_infinite_R.png'" style="width: 70upx;height: 45upx;"
									mode="widthFix" v-if="item.reword_type_id == 21"></image>
								<image :src="Imgbase + '/new1_infinite_N.png'" style="width: 70upx;height: 45upx;"
									mode="widthFix" v-if="item.reword_type_id == 17"></image>
								<image :src="Imgbase + '/new1_infinite_M.png'" style="width: 70upx;height: 45upx;"
									mode="widthFix" v-if="item.reword_type_id == 16"></image>
								<image :src="Imgbase + '/new1_infinite_SSS_new.png'" style="width: 118upx;height: 45upx;"
									mode="widthFix" v-if="item.reword_type_id == 35"></image>
							</view>
							<text class="fl padding-left-sm"
								style="line-height: 50upx;color: #3E2025;">共{{item.goodinfo.length}}种 获取概率{{Number(item.point/desc.point*100).toFixed(3)}}%</text>
						</view>
						<scroll-view scroll-x="true" scroll-with-animation
							style="width: 100%;white-space: nowrap;overflow : auto;margin-bottom: 10upx;height: 390upx;">
							<view class="" v-for="(gooditem,goodindex) in item.goodinfo" style="width: 38%;margin-bottom: 10upx;margin-left: 25rpx;display: inline-block;padding: 10upx 10upx;
					margin-right: 0rpx;margin-top: 0rpx;position: relative;height: 360upx;" :style="{background:item.reword_type_id == 31?'url('+Imgbase+'/new1_infinite_SSR1.png) no-repeat':
					item.reword_type_id == 32?'url('+Imgbase+'/new1_infinite_SR1.png) no-repeat':
					item.reword_type_id == 30?'url('+Imgbase+'/new1_infinite_SD1.png) no-repeat':
					item.reword_type_id == 21?'url('+Imgbase+'/new1_infinite_R1.png) no-repeat':
					item.reword_type_id == 17?'url('+Imgbase+'/new1_infinite_N1.png) no-repeat':
					item.reword_type_id == 16?'url('+Imgbase+'/new1_infinite_M1.png) no-repeat':
					item.reword_type_id == 35?'url('+Imgbase+'/new1_infinite_SSS1.png) no-repeat':''
					,'background-size':'100% 100%',}">
								<image :src="gooditem.goodmes.adimage" mode="widthFix" style="min-height: 105px;">
								</image>
								<view class="text-newblack"
									style="max-width: 250upx;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;padding: 0 8rpx;font-weight: bold;">
									{{gooditem.goodmes.name}}
								</view>
								<view class="text-grey text-sm" style="padding: 0 8rpx;">
									获取概率:{{Number(gooditem.point/desc.point*100).toFixed(3)}}%
								</view>
							</view>
						</scroll-view>
					</view>
					<view style="clear: both;"></view>
				</view>
				<!-- BOX赏 -->
				<view class="" v-if="both_thow == 1"
					style="position: relative;background: #FBFADC;  min-height: 1000rpx;width: 96%; margin: 0 auto;padding-top: 20rpx;">
					<view class="cu-card article light" style="position: relative;
				width: 100%;margin-left: 0%;margin-top: 10upx;height: 420rpx;" v-for="(item,index) in desc.extroinfo">
						<view class="padding-left padding-tb-xs" style="height: 55upx;">
							<view class="fl">
								<image :src="Imgbase + '/new1_infinite_SSR.png'" style="width: 118upx;height: 45upx;"
									mode="widthFix" v-if="item.reword_type_id == 31"></image>
								<image :src="Imgbase + '/new1_infinite_SR.png'" style="width: 90upx;height: 45upx;"
									mode="widthFix" v-if="item.reword_type_id == 32"></image>
								<image :src="Imgbase + '/new1_infinite_SD.png'" style="width: 90upx;height: 45upx;"
									mode="widthFix" v-if="item.reword_type_id == 30"></image>
								<image :src="Imgbase + '/new1_infinite_R.png'" style="width: 70upx;height: 45upx;"
									mode="widthFix" v-if="item.reword_type_id == 21"></image>
								<image :src="Imgbase + '/new1_infinite_N.png'" style="width: 70upx;height: 45upx;"
									mode="widthFix" v-if="item.reword_type_id == 17"></image>
								<image :src="Imgbase + '/new1_infinite_M.png'" style="width: 70upx;height: 45upx;"
									mode="widthFix" v-if="item.reword_type_id == 16"></image>
								<image :src="Imgbase + '/new1_infinite_SSS_new.png'" style="width: 118upx;height: 45upx;"
									mode="widthFix" v-if="item.reword_type_id == 35"></image>
							</view>
							<text class="fl padding-left-sm"
								style="line-height: 50upx;color: #3E2025;">共{{item.goodinfo.length}}种
								获取概率{{Number(item.point/desc.point*100).toFixed(3)}}%</text>
						</view>
						<scroll-view scroll-x="true" scroll-with-animation
							style="width: 100%;white-space: nowrap;overflow : auto;margin-bottom: 10upx;height: 390upx;">
							<view class="" v-for="(gooditem,goodindex) in item.goodinfo" style="width: 38%;margin-bottom: 10upx;margin-left: 25rpx;display: inline-block;padding: 10upx 10upx;
					margin-right: 0rpx;margin-top: 0rpx;position: relative;height: 360upx;" :style="{background:item.reword_type_id == 31?'url('+Imgbase+'/new1_infinite_SSR1.png) no-repeat':
					item.reword_type_id == 32?'url('+Imgbase+'/new1_infinite_SR1.png) no-repeat':
					item.reword_type_id == 30?'url('+Imgbase+'/new1_infinite_SD1.png) no-repeat':
					item.reword_type_id == 21?'url('+Imgbase+'/new1_infinite_R1.png) no-repeat':
					item.reword_type_id == 17?'url('+Imgbase+'/new1_infinite_N1.png) no-repeat':
					item.reword_type_id == 16?'url('+Imgbase+'/new1_infinite_M1.png) no-repeat':
					item.reword_type_id == 35?'url('+Imgbase+'/new1_infinite_SSS1.png) no-repeat':''
					,'background-size':'100% 100%',}">
								<image :src="gooditem.goodmes.adimage" mode="widthFix" style="min-height: 105px;">
								</image>
								<view class="text-newblack"
									style="max-width: 250upx;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;padding: 0 8rpx;font-weight: bold;">
									{{gooditem.goodmes.name}}
								</view>
								<view class="text-grey text-sm" style="padding: 0 8rpx;">
									获取概率:{{Number(gooditem.point/desc.point*100).toFixed(3)}}%
								</view>
							</view>
						</scroll-view>
					</view>
					<view style="clear: both;"></view>
				</view>
			</view>

			<view style="width: 96%;height:80upx;margin: 0 auto;">
				<image :src="Imgbase + '/app_index_c_bottom.png'" mode="widthFix" style="width: 100%;"></image>
			</view>

			<view style="clear: both;"></view>
		</view>
		<view style="clear: both;"></view>
		<view style="width: 100%;height: 180upx;"></view>
		<view class="cu-load load-modal" v-if="loadModal">
			<image src="/static/icon.jpg" mode="aspectFit"></image>
			<view class="gray-text">加载中...</view>
		</view>
	</scroll-view>
</template>
<script>
	export default {
		data() {
			return {
				Imgbase: getApp().globalData.Imgbase,
				desc: null,
				id: null,
				title: '抽赏',
				page: 1,
				count: 10,
				modalName: null,
				did: 0,
				loadModal: false,
				round: 0,
			}
		},
		methods: {
			hideModal(e) {
				this.modalName = null
			},
			loadDesc(id) {
				let _this = this;
				_this.page = 1;
				_this.loadModal = true;
				uni.request({
					url: _this.$globals.apibase + '/api/Infinite/hiddendesc',
					data: {
						token: uni.getStorageSync('token'),
						id: id,
					},
					method: 'POST',
					header: {
						'content-type': 'application/json'
					},
					success: (res) => {
						if (res.data.code == '401') {
							uni.setStorageSync('token', '');
						}
						if (res.data.code == '1') {
							_this.desc = res.data.data.desc.hidden_mes;
							_this.title = res.data.data.desc.hidden_mes.name;
						}
						if (res.data.code == '0') {
							uni.showToast({
								icon: 'none',
								title: res.data.msg
							});
						}
						_this.loadModal = false;
					}
				});
			},
		},
		onUnload() {},
		onShow() {},
		onLoad(options) {
			let _this = this;
			this.did = options.id;
			this.loadDesc(this.did);
		},
	}
</script>

<style>
	button::after {
		border: initial;
	}

	.fl {
		float: left;
	}

	.fr {
		float: right;
	}

	.refresh_icon {
		height: 80upx;
		width: 80upx;
	}
</style>
